<!--
 * @Author: hutong huareu980@163.com
 * @Date: 2023-06-01 17:40:13
 * @LastEditors: hutong huareu980@163.com
 * @LastEditTime: 2023-06-13 19:17:36
 * @FilePath: /smart-web-app/pages/content/[routeId]/[id].vue
 * @Description: 
-->
<template>
  <div>
    <div class="top-img">
      <!-- <img src="~/assets/image/05.jpg" alt="" /> -->
      <img
        :src="info.images[0]"
        alt=""
        v-if="info && info.images && info.images.length"
      />
    </div>
    <div class="breadcrumb-box">
      <div class="container">{{ $t("nav.home.name") }} > {{ info.title }}</div>
    </div>
    <div class="container pt20 pb20">
      <Content :modelValue="navId" :title="info.title" :list="info.children">
        <!-- 招聘职位 -->
        <template #content="{ scoped }" v-if="routeId === 60 && navId === 63">
          <job></job>
        </template>
      </Content>
    </div>
  </div>
</template>

<script setup lang="ts">
const route = useRoute();
const { locale } = useI18n();
const navId = ref<any>("");
const routeId = +route.params.routeId;
const pageId = route.params.id;
navId.value = +pageId;
const { data } = <any>(
  await useGetFetch(`/t/${routeId}`, { lang: locale.value })
);
const { info } = useContentInfo(data.value.result);
</script>
<style scoped lang="scss">
.top-img {
  font-size: 0;
  img {
    width: 100%;
    height: 398px;
    object-fit: cover;
  }
}
.breadcrumb-box {
  background-color: #eeeeee;
  .container {
    padding: 20px 0;
    font-size: 14px;
    cursor: pointer;
  }
}
.content-img {
  height: 165px;
  width: 100%;
  object-fit: cover;
}
</style>
